import request from '../../utils/request'
// 获取全局app实例
const appInstance = getApp()

// pages/playSong/playSong.js
Page({

    /**
     * 页面的初始数据
     */
    data: {
        isPlay: false, // 标识是否在播放的状态
        musicDetail: [],
        musicAdressInfo: [],
        musicId: 0  // 音乐的id
    },

    // 处理是否播放事件
    handlePlay() {
        this.musicController(!this.data.isPlay)
    },

    // 控制音乐的播放和暂停
    musicController(isPlay) {
        if(isPlay){
            console.log('播放');
            if(this.data.musicAdressInfo.url){
                this.backgroudAudioManager.src = this.data.musicAdressInfo.url
                this.backgroudAudioManager.title = this.data.musicDetail.name
            }else{
                wx.showToast({
                  title: '因版权问题，暂无法播放',
                  icon: 'none'
                })
            }
        }else{
            console.log('暂停');
            // 暂停音乐
            this.backgroudAudioManager.pause()
        }
    },

    // 获取音乐播放地址
    async getMusicPlayAddress(id) {
        const res = await request('/song/url', {
            id
        })
        this.setData({
            musicAdressInfo: res.data[0]
        })
        // 这里解决异步请求的问题，当切换歌曲的时候，获取播放地址之后，会自动播放
        if(this.data.musicId === this.data.musicAdressInfo.id){
            this.musicController(this.data.isPlay)
        }
    },

    // 获取音乐详细信息
    async getMusicDetail(id) {
        const res = await request('/song/detail', {
            ids: id
        })
        this.setData({
            musicDetail: res.songs[0]
        })
        // 动态设置当前窗口的标题
        wx.setNavigationBarTitle({
            title: this.data.musicDetail.name,
          })
    },

    // 修改播放的状态
    changeIsPlay(isPlay) {
        this.setData({
            isPlay
        })
        // 修改全局实例对象的音乐播放状态
        appInstance.globalData.isMusicPlsy = isPlay
    },

    // 切换上一首/下一首的回调
    handleSwitch(e) {
        let index = appInstance.globalData.playList.findIndex(item => item.id === this.data.musicId >>> 0)
        index += e.currentTarget.dataset.index
        if(index < 0){
            index = appInstance.globalData.playList.length - 1
        }else if(index > appInstance.globalData.playList.length - 1){
            index = 0
        }
        // console.log(musicId);
        // 更新musicId
        this.setData({
            musicId: appInstance.globalData.playList[index].id
        })
        // 获取音乐详情
        this.getMusicDetail(this.data.musicId)
        // 获取音乐播放地址
        this.getMusicPlayAddress(this.data.musicId)
        // 切换为isPlay播放状态
        this.setData({
            isPlay: true
        })
    },

    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function (options) {
        // 可以通过options接收到路由传过来的query参数
        this.getMusicDetail(options.id)
        this.setData({
            musicId: options.id
        })
        // 获取音乐播放地址
        this.getMusicPlayAddress(this.data.musicId)

        // 判断在打开页面前，是否有播放着音乐和是否是当前音乐
        if(appInstance.globalData.isMusicPlsy && appInstance.globalData.musicId === options.id){
            this.setData({
                isPlay: true
            })
        }

        // 将音乐播放管理器，声明为全局变量
        this.backgroudAudioManager = wx.getBackgroundAudioManager()
        // 监听后台暂停/暂停事件
        this.backgroudAudioManager.onPause(() => {
            this.changeIsPlay(false)
        })
        // 监听后台播放/播放事件
        this.backgroudAudioManager.onPlay(() => {
            this.changeIsPlay(true)
            // 在播放开始的时候，更新全局实例对象的音乐id为此次播放的id
            appInstance.globalData.musicId = options.id
        })
        // 监听音乐被停止的事件
        this.backgroudAudioManager.onStop(() => {
            this.changeIsPlay(false)
        })
    },

    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {

    },

    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {

    },

    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {

    },

    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {

    },

    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {

    },

    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {

    },

    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function () {

    }
})